<script setup>
  import {ref} from 'vue'
  /**
   * 注意点
   * ref函数包裹的响应式数据
   * -- 在模版中使用，正常使用
   * -- 在script标签中，需要.value
   */
  const person = ref({
    name:'张三',
    age:18
  })
  console.log(person);
  
  const changeName =()=> person.value.name = '李四'
  const changeAge =()=> person.value.age = 20
</script>

<template>
  <div>
    <div>{{ person }}</div>
    <button @click="changeName">修改姓名</button>
    <button @click="changeAge">修改年龄</button>
  </div>
</template>

<style scoped>

</style>
